<template>
    <div class="mark-box">
			<ul class="flex ">
				<li v-for="(item,i) in listdata" :key='i'>
					<div class="flex flex-between ">
						<h3 class="font-18 mpfff">{{item.title}}</h3>
					</div>
          <div class="m-top-10 tips">
            <p class="mpcolor font-14">300%以上的粉丝增长率量身定制图文
              信息快速转化为营销提量                            
            </p>
          </div>
				</li>
			</ul>
    </div>
</template>
<script>
export default {
  name: "marketData",
  data() {
    return {
      noticeItem: null,
      listdata:[{title:'IOS开发'},{title:'Android开发'},{title:'高端官网'},
        {title:'小程序开发'},{title:'区块链项目'},{title:'商城系统'},
      ],
       options: [{
          value: 'BTC',
          label: 'BTC'
        }, 
        {
          value: 'ETH',
          label: 'ETH'
        }, 
       ]  
    };
  },
  mounted() {
    
  },
  methods: {

  }
};
</script>
<style  scoped>
.notice-bar {
  background: #041F3A;
  font-size: 14px;
  text-align: center;
}
.notice-bar.text-wrap {
    display: inline-block;
    padding: 0 15px;
    max-width: 20%;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #fff;
  }
.mark-box{
  background:#041F3A;box-sizing: border-box;
}
.mark-box ul{margin: 0;display: flex;}
.mark-box ul li{
  width: 16%;
  flex: 1;
  margin: 3px 4px 0 4px;
  padding: 25px 12px;
  border:1px solid rgba(113,115,137,0.2);
  cursor:pointer;
}
.mark-box ul li h3{color:#ffffff;font-size: 16px;padding: 5px 0;font-weight: normal;}
.tips p{color: #647498;margin-top: 5px;}
.tips{line-height: 20px;}
.wit1{width: 150px;}
.wit2{width: 300px;margin: 0 15PX;}
.wit3{width: 150px;}
.wit4{width: 150px;}
</style>